/**
 * Created by dengyuanke on 2018/5/16.
 */
Vue.component("header-componet",{
    template:"<header id='site-header'>"+
    "<div class='row'>"+
    "<div class='col-md-4 col-sm-5 col-xs-8'>"+
    "<div class='logo'>"+
    "<h1><a href='index.html'><b>dengyuanke</b>.com</a></h1>"+
    "</div>"+
    "</div>"+
    "<div class='col-md-8 col-sm-7 col-xs-4'>"+
    "<nav class='main-nav' role='navigation'>"+
    "<div class='navbar-header'>"+
    "<button type='button' id='trigger-overlay' class='navbar-toggle'>" +
    "<span class='ion-navicon'></span></button></div>"+
            "<div class='collapse navbar-collapse' id='bs-example-navbar-collapse-1'>"+
            "<ul class='nav navbar-nav navbar-right'>"+
    "<li class='cl-effect-11'><a href='index.html' data-hover='首页'>首页</a></li>"+
    "<li class='cl-effect-11'><a href='full-width.html?type=artiscles' data-hover='博客'>博客</a></li>"+
    "<li class='cl-effect-11'><a href='about.html' data-hover='关于'>关于</a></li>"+
    // "<li class='cl-effect-11'><a href='contact.html' data-hover='联系'>联系</a></li>"+
    "</ul>"+
    "</div>"+
"</nav>"+
// "<div id='header-search-box'>"+
//     "<a id='search-menu' href='#'><span id='search-icon' class='ion-ios-search-strong'></span></a>"+
//     "<div id='search-form' class='search-form'>"+
//     "<form role='search' method='get' id='searchform' action='#'>"+
//     "<input type='search' placeholder='搜索' required>"+
// "<button type='submit'><span class='ion-ios-search-strong'></span></button>"+
//     "</form>"+
//     "</div>"+
//     "</div>"+
    "</div>"+
    "</div>"+
    "</header>"
});

Vue.component("aside-componet",{
    mounted:function () {
        this.$nextTick(function () {
            this.initView();
        })
    },
    data:function(){
            return{
                archives:[],
                categories:[],
                recentArtiscles:[]
            }
    },
    methods: {
        initView:function () {
            var _this=this;
            axios.get(url+'categories')
                .then(function (response) {
                    _this.categories=response.data.data;
                })
                .catch(function (error) {
                    console.log(error);
                });
            axios.get(url+'archives')
                .then(function (response) {
                    _this.archives=response.data.data;
                })
                .catch(function (error) {
                    console.log(error);
                });
            axios.get(url+'artiscles/recently')
                .then(function (response) {
                    _this.recentArtiscles=response.data.data;
                })
                .catch(function (error) {
                    console.log(error);
                });
        },
        archiveFormat:function (date) {
            let year=date.substring(0,date.indexOf("年"));
            let month=date.substring(date.indexOf("年")+1,date.indexOf("月"));
            window.location.href="full-width.html?type=archive&date="+year+month;
        },
        categoryRedirect:function (id) {
            window.location.href="full-width.html?type=category&id="+id;
        },
        artiscleRedirect:function (id) {
            window.location.href="single.html?id="+id;
        }
    },
    template:"<div><div class='widget widget-recent-posts'>"+
    "<h3 class='widget-title'>最近文章</h3>"+
    "<ul>"+
    "<li v-for='artiscle in recentArtiscles'>"+
    "<a href='#' @click='artiscleRedirect(artiscle.id)'>{{artiscle.title}}</a>"+
    "</li>"+
    "</ul>"+
    "</div>"+
    "<div class='widget widget-archives'>"+
    "<h3 class='widget-title'>文章归档</h3>"+
    "<ul>"+
    "<li v-for='archive in archives'>"+
    "<a href='#' @click='archiveFormat(archive)'>{{archive}}</a>"+
"</li>"+
"</ul>"+
"</div>"+
"<div class='widget widget-category'>"+
    "<h3 class='widget-title'>类别</h3>"+
    "<ul>"+
    "<li v-for='category in categories'>"+
    "<a href='#' @click='categoryRedirect(category.id)'>{{category.name}}</a>"+
"</li>"+
"</ul>"+
"</div></div>"
});